<!DOCTYPE html>
<html>
<head lang="zh">
  <meta charset="UTF-8">
  <title>Document</title>
  <!--<link rel="stylesheet" href="css/index.css"/>-->
  <style>
    .bg {
      position: relative;
      height: 500px;
      background: url("./images/bg.png");
    }

    img {
      position: absolute;
      bottom: 0;
      left: 30px;
      animation: move 5s 0s ease-in-out infinite;
    }

    @keyframes move {
      from {
        left: 10%;
      }
      49% {
        transform: rotateY(0deg);
        left: 90%;
      }
      50% {
        transform: rotateY(180deg);
        left: 90%;
      }
      99% {
        transform: rotateY(180deg);
        left: 20%;
      }
      100% {
        left: 20%;
        transform: rotateY(0deg);
      }
    }
  </style>
</head>
<body>
<div class="bg">
  <img src="./images/car.png" alt="" />
</div>
</body>
<!--<script src="js/jquery-1.8.3.min.js"></script>-->
<script>

</script>
</html>
